﻿<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8" />
    <title>智选写字楼</title>
    <meta name="keywords" content="" />
    <meta name="description" content="" />
    <link rel="shortcut icon" href="./images/icon.ico" type="image/x-icon" />
    <link rel="icon" href="./images/icon.jpg" type="image/jpg">
    <link href="static/ffyxq/js/swiper/swiper-4.0.5.min.css" rel="stylesheet" />
    <link
      rel="stylesheet"
      type="text/css"
      href="static/ffyxq/css/font-awesome.min.css"
    />
    <link
      rel="stylesheet"
      type="text/css"
      href="static/ffyxq/css/style.css?version=1.0.12"
    />
    <link
      rel="stylesheet"
      type="text/css"
      href="static/ffyxq/css/deta.css?version=1.0.12"
    />
    <link
      rel="stylesheet"
      type="text/css"
      href="static/ffyxq/css/house.css?version=1.0.12"
    />
    <link
      rel="stylesheet"
      type="text/css"
      href="static/ffyxq/css/head.css?version=1.0.12"
    />
    <link rel="stylesheet" type="text/css" href="static/ffyxq/css/layui.css" />
    <script src="static/js/config.js?version=1.0.12"></script>
    <script
      type="text/javascript"
      src="http://api.map.baidu.com/api?v=2.0&ak=slQh6wYeGi2K2Lnrk7pfZHyVUfdjVdtD"
    ></script>
    <script
      type="text/javascript"
      charset="utf-8"
      src="static/ffyxq/js/jquery-1.11.2.min.js"
    ></script>
    <script
      type="text/javascript"
      charset="utf-8"
      src="static/ffyxq/js/bootstrap.min.js"
    ></script>
    <script
      type="text/javascript"
      charset="utf-8"
      src="static/ffyxq/js/swiper/swiper-3.4.2.min.js"
    ></script>
    <script
      type="text/javascript"
      charset="utf-8"
      src="static/ffyxq/js/common.js"
    ></script>
    <script src="js/supermap/SuperMap.Include.js"></script>
    <script
      type="text/javascript"
      charset="utf-8"
      src="js/js/service.js?version=1.0.12"
    ></script>
    <script
      type="text/javascript"
      charset="utf-8"
      src="js/js/query.js?version=1.0.12"
    ></script>
    <script
      type="text/javascript"
      src="js/require.min.js"
      data-main="js/main"
    ></script>
    <script type="text/javascript" src="js/md5.js"></script>
    <!-- <script
      type="text/javascript"
      charset="utf-8"
      src="static/js/ffyxq.js"
    ></script> -->
    <!-- <script type="text/javascript"
    charset="utf-8"
    src="static/js/unify.js"></script> -->

    <style>
      .fang-detail .titlea {
        color: #464b5d;
        font-weight: bold;
        /* text-overflow: ellipsis;
        white-space: nowrap;
        overflow: hidden; */
        margin: 15px 0;
        font-size: 20px;
      }
      .side-house ul li > a {
        overflow: hidden;
        white-space: nowrap;
        text-overflow: ellipsis;
      }
      .BMap_pop {
        display: none;
      }
      .BMap_shadow {
        display: none;
      }
      .BMapLabel {
        background-color: #5085f9;
        margin-left: 20px;
        /* color:white; */
      }
      .anchorBL {
        display: none;
      }
      .anchorBL span {
        display: none;
      }
      .cesium-credit-image {
        display: none;
      }
      .cesium-viewer-bottom {
        display: none;
      }
      .chuang-room-tip {
        margin-top: 8px;
      }
      .cesium-infoBox-title {
        display: none;
      }
      .cesium-svgPath-svg {
        display: none;
      }
      .cesium-infoBox-close {
        display: none;
      }
      .cesium-button .cesium-infoBox-camera {
        display: none;
      }
      .cesium-infoBox-visible {
        visibility: hidden;
      }
      .cesium-viewer-selectionIndicatorContainer {
        display: none;
      }
      .cesium-infoBox .cesium-infoBox-bodyless .cesium-infoBox-visible {
        display: none;
      }
      .cesium-viewer-infoBoxContainer {
        display: none;
      }
      .cesium-viewer-zoomIndicatorContainer {
        display: none;
      }
      /* canvas {width:720px;height:478px;} */
      canvas {
        width: 690px;
        height: 423px;
      }
      .maskLayer {
        position: fixed;
        top: 0;
        left: 0;
        z-index: 999;
        width: 100%;
        height: 100%;
        display: flex;
        justify-content: center;
        background-color: rgba(1, 1, 1, 0.9);
        align-items: center;
      }
    </style>
  </head>

  <body id="index" class="house-detail">
    <!--页面头部-->
    <div class="new-header-2">
      <div class="site-top-nav">
        <div class="section clearfix">
          <div class="pull-left left-nav-click">
            <a href="/item/views/search/searchBuildingHouse.html">写字楼</a>
            <a href="/item/views/search/searchBuildingHouse.html">园区</a>
            <a href="/item/views/search/searchUnitedCommunity.html">联合办公</a>
            <a href="javascript:;">|</a>
            <a href="/item/views/others/service.html">平台与服务</a>
            <a href="/item/views/others/rent.html">直租计划</a>
            <a href="/item/views/others/enterDevelopers.html">发布信息</a>
          </div>
          <div class="pull-right right-nav-click">
            <a class="select" onclick="goLoginOr()" id="logind"></a>
            <a href="/console/#/loginphone">注册</a>
            <a href="javascript:;"
              ><img src="static/ffyxq/images/top-phone.svg" />010-65883141</a
            >
          </div>
        </div>
      </div>
      <div class="fix-header-con">
        <div class="section clearfix">
          <a href="/home/html/" class="logo-small pull-left">
            <img
              src="static/ffyxq/images/logo-s5.svg"
              width="135px"
              height="38px"
            />
            <div class="cttyTitle">城市元素 (北京) 科技有限公司</div>
          </a>
          <div class="con-line pull-left"></div>
          <div class="nav">
            <a
              href="/item/views/search/searchBuildingHouse.html"
              class="tj-pc-nav"
              >写字楼</a
            >
            <a
              href="/item/views/search/searchBuildingHouse.html"
              class="tj-pc-nav"
              >园区</a
            >
            <a
              href="/item/views/search/searchUnitedCommunity.html"
              class="tj-pc-nav"
              >联合办公</a
            >
          </div>
          <div class="search-nav">
            <form id="public_form_search" onsubmit="return false;">
              <input
                type="text"
                class="pull-left"
                placeholder="搜索你想找的房源"
                autocomplete="off"
                id="keywords"
                onkeyup="getkey(event)"
              />
              <a onclick="goSearch()"><i class="fa fa-search"></i></a>
            </form>
          </div>
        </div>
      </div>
    </div>
    <!--/页面头部-->

    <!--房源信息-->
    <div class="section" style="margin-top:141px;">
      <div class="wrapper">
        <div class="wrap-box clearfix">
          <!-- <div id="scenediv" class="left-720" style="margin:0;height:478px;width:720px;">
                 	<a href="javascript:;" id="qjzbbtn" style="background-color:white;position:absolute;margin-left:30px;margin-top:20px;">全景周边</a>
                 <img id="img1" src="images/zhinanzhen1.png"  style="position: absolute;z-index:3;height: 32px;width: 32px;border: 0px;right: 14px;margin-top: 14px;transform:rotate(20deg)" />
                        	<img id="fd" src="images/fangda.png" style="height:32px;width:32px;position: absolute;margin-top:274px;right:14px;z-index: 999;cursor: pointer;" onclick="add()"/>
							<img id="sx" src="images/suoxiao.png" style="height:32px;width:32px;position: absolute;margin-top:306px;right:14px;z-index: 999;cursor: pointer;" onclick="reduce()"/> 
                        	<img id="fy" src="images/fuyuan.png" style="height:32px;width:32px;position: absolute;right:14px;margin-top:234px;z-index: 999;cursor: pointer;" onclick="reset()" />
                </div> -->
          <div class="left-720" style="margin:0;">
            <div id="focus-box" class="detail-box">
              <div class="d-shadow" id="three-d" style="display:none;">
                <div
                  id="scenediv"
                  class="house-demo"
                  style="height:423px;position: relative;"
                >
                  <a
                    href="javascript:;"
                    class="qjzb"
                    id="qjzbbtn"
                    style="color: #fff;padding: 6px 20px;position:absolute;margin-left:30px;margin-top:20px;background: #00A0E9;border-radius: 5px;"
                    >全景周边</a
                  >
                  <!-- 此处显示房源模型 -->
                  <img
                    id="img1"
                    src="images/zhinanzhen1.png"
                    style="position: absolute;z-index:3;height: 32px;width: 32px;border: 0px;right: 14px;margin-top: 14px;transform:rotate(20deg)"
                  />
                  <img
                    id="fd"
                    src="images/fangda.png"
                    style="height:32px;width:32px;position: absolute;margin-top:274px;right:14px;z-index: 999;cursor: pointer;"
                    onclick="add()"
                  />
                  <img
                    id="sx"
                    src="images/suoxiao.png"
                    style="height:32px;width:32px;position: absolute;margin-top:306px;right:14px;z-index: 999;cursor: pointer;"
                    onclick="reduce()"
                  />
                  <img
                    id="fy"
                    src="images/fuyuan.png"
                    style="height:32px;width:32px;position: absolute;right:14px;margin-top:234px;z-index: 999;cursor: pointer;"
                    onclick="reset()"
                  />
                  <!-- 此处显示房源模型 -->
                </div>
              </div>
              <!-- 这里放图片 -->
              <div class="picture" id="picture">
                <div class="swiper-container main-page">
                  <div class="swiper-wrapper" id="piclist">
                    <!-- <div class="swiper-slide">
                                        <img src="images/inner.png">
                                    </div>
                                    <div class="swiper-slide">
                                        <img src="images/inner.png">
                                    </div>
                                    <div class="swiper-slide">
                                        <img src="images/inner.png">
                                    </div> -->
                  </div>
                  <div class="swiper-button-prev"></div>
                  <div class="swiper-button-next"></div>
                  <div class="swiper-pagination"></div>
                </div>
              </div>
              <p class="button" id="img-3D-tab">
                <a
                  style="margin-right:5px;"
                  href="javascript:;"
                  class="active"
                  data-type="picture"
                  >图片</a
                >
                <a
                  style="margin-left:5px;display:none;"
                  href="javascript:;"
                  data-type="three-d"
                  id="three-click"
                  >3D</a
                >
              </p>
            </div>
            <!-- <div class="swiper-container main-page">
                        <div class="swiper-wrapper">
                            <div class="swiper-slide">
                                <img src="images/inner.png">
                            </div>
                            <div class="swiper-slide">
                                <img src="images/inner.png">
                            </div>
                            <div class="swiper-slide">
                                <img src="images/inner.png">
                            </div>
                        </div>
                        <div class="swiper-button-prev"></div>
                        <div class="swiper-button-next"></div>
                        <div class="swiper-pagination"></div>
                    </div> -->
          </div>
          <div class="left-425">
            <div class="side-info-box fang-detail">
              <div class="side-info-item">
                <div class="side-info-tag" style="width: 100%">
                  <a class="titlea" id="title"
                    ></a
                  >
                </div>
              </div>
              <div class="side-info-item" style="position: relative;">
                <div class="side-info-tag">
                  <span class="num" id="price"></span
                  ><span class="num-unit">元/m²/天</span>
                </div>
                <div class="side-info-tag">
                  <span class="area" id="mianji"></span
                  ><span class="area-unit">m²</span>
                </div>
                <!-- <div
                  class="side-info-tag"
                  style="padding-top: 22px;position: absolute;right: 45px;top: -28px;"
                  id="roomNo"
                ></div> -->
                <!-- <div class="side-info-tag" style="padding-top:11px;">
                  约<span class="black-num" id="zj"></span>万／月
                </div> -->
              </div>
              <!-- <div class="side-info-item">
                <div class="side-info-tag" id="tag-name">
                  <span
                    class="special-tag green"
                    id="subwayDistanceName"
                  ></span>
                  <span class="special-tag blue" id="lbrz"></span>
                </div>
              </div> -->
              <div class="split-line">
                <div class="side-info-item" style="padding-bottom:10px;">
                  <div class="side-info-tag" style="padding-top:11px;">
                    约<span class="black-num" id="zj"></span>万／月
                  </div>
                  <div class="side-info-tag" style="padding-top:11px;">
                      房号<span class="black-num" id="roomNo""></span>
                    </div>
                </div>
                <div class="side-info-item">
                  <div class="side-info-tag" id="sjsj">上架：2018-10-31</div>
                  <div class="side-info-tag">
                    <span id="fyyll"></span>
                    <span style="padding-left:15px;" id="collection-num"></span>
                  </div>
                </div>
              </div>

              <div class="side-info-item">
                <div class="side-info-tag address">
                  <i class="fa fa-map-marker"></i><span id="lpdz"></span>
                </div>
              </div>
              <div class="side-info-item">
                <ul class="side-house clearfix">
                  <li>
                    <span>起租时间：</span>
                    <a id="qzsj"></a>
                  </li>
                  <li>
                    <span>装修情况：</span>
                    <a id="zxqk"></a>
                  </li>
                  <li>
                    <span>最短租期：</span>
                    <a id="zdzq"></a>
                  </li>
                  <li>
                    <span>隔断办公间：</span>
                    <a id="gdbgj"></a>
                  </li>
                  <li>
                    <span>付款方式：</span>
                    <a id="fkfs"></a>
                  </li>
                  <li>
                    <span>可容纳工位：</span>
                    <a id="krngw"></a>
                  </li>
                  <li>
                    <span>是否可注册：</span>
                    <a id="sfkzc"></a>
                  </li>
                  <li>
                    <span>朝向：</span>
                    <a id="chaoxiang">东</a>
                  </li>
                  <!-- <li>
                    <span>面积：</span>
                    <a id="mianji">250m²</a>
                  </li> -->
                </ul>
              </div>
            </div>
            <div class="clearfix" style="margin-left: 35px;">
              <div class="clearfix">
                <span id="collection-img"> </span>

                <a
                  class="pull-right info-button"
                  href="javascript:;"
                  id="phone"
                  data-original-title="187-8888-8888"
                  data-toggle="tooltip"
                  data-placement="left"
                  data-trigger="click"
                >
                  <img
                    src="static/ffyxq/images/location-phone.svg"
                    style="width:19px;vertical-align:middle;"
                  />&nbsp;电 话
                </a>
              </div>
            </div>
          </div>
        </div>
      </div>

      <div class="wrapper mt-45">
        <div class="wrap-box clearfix">
          <div class="left-720" style="margin:0;">
            <div class="mode-title">
              <h3>房源荐语</h3>
            </div>
            <div class="mode-content dis" id="lpjs">
              1887年3月7日，喜来登的创建人欧内斯特-亨德森生于离美国波士顿不远的粟树山镇。亨德森先生1933年开始进入饭店业，喜来登是喜来登旅馆公司最初的两家饭店中一个名字，在1937年他成立喜来登旅馆公司，该饭店公司1939年开始启用喜来登这个统一的名称，直到1957年，即喜来登公司成立20年时才真正建造了自己的第一座饭店。1887年3月7日，喜来登的创建人欧内斯特-亨德森生于离美国波士顿不远的粟树山镇。亨德森先生1933年开始进入饭店业，喜来登是喜来登旅馆公司最初的两家饭店中一个名字，在1937年他成立喜来登旅馆公司，该饭店公司1939年开始启用喜来登这个统一的名称，直到1957年，即喜来登公司成立20年时才真正建造了自己的第一座饭店。
            </div>
          </div>
          <div class="left-425 issue-per" style="margin-bottom:10px;">
            <div class="mode-title" style="margin-left: 35px;">
              <h3>发布方</h3>
            </div>
            <div class="mode-content" id="fabufang" style="margin-left: 35px;">
              <!-- 四种不同类型的发布方，选择显示 -->

              <!-- 开发商 -->
              <!-- <div class="publisher">
                            <div class="inner">
                                <div class="publisher-img">
                                    <img src="images/agent.png">
                                </div>
                                <div class="publisher-info">
                                    <h3>华贸中心</h3>
                                    <span class="special-tag lightblue" style="vertical-align:text-bottom;">开发商</span>
                                    <p style="color:#464B5D;">发布中房源：48（近三个月发布123）</p>
                                    <p>
                                        <span>浏览量：1288次</span><span>月咨询：58次</span>
                                    </p>
                                </div>
                            </div>
                        </div> -->
              <!-- 开发商 -->
              <!-- 资产管理公司 -->
              <!-- <div class="publisher">
                            <div class="inner">
                                <div class="publisher-img">
                                    <img src="images/agent.png">
                                </div>
                                <div class="publisher-info">
                                    <h3>纳什空间</h3>
                                    <span class="special-tag lightpurple"
                                        style="vertical-align:text-bottom;">资产管理公司</span>
                                    <p style="color:#464B5D;">发布中房源：48（近三个月发布123）</p>
                                    <p>
                                        <span>浏览量：1288次</span><span>月咨询：58次</span>
                                    </p>
                                </div>
                            </div>
                        </div> -->
              <!-- 资产管理公司 -->
              <!-- 个人业主 -->
              <!-- <div class="publisher">
                            <div class="inner">
                                <div class="publisher-img">
                                    <img src="images/agent-self.png">
                                </div>
                                <div class="publisher-info">
                                    <h3>纳什空间</h3>
                                    <span class="special-tag lightred" style="vertical-align:text-bottom;">个人业主</span>
                                </div>
                            </div>
                        </div> -->
              <!-- 个人业主 -->
              <!-- <div class="publisher">
                <div class="inner">
                  <div class="publisher-img">
                    <img src="static/ffyxq/images/agent.png" />
                  </div>
                  <div class="publisher-info">
                    <h3>孙策</h3>
                    <span
                      class="special-tag lightorange"
                      style="vertical-align:text-bottom;"
                      >经纪人</span
                    >
                    <p style="color:#464B5D;">
                      发布中房源：48（近三个月推送楼书1230）
                    </p>
                    <p><span>浏览量：1288次</span><span>月咨询：58次</span></p>
                    <p><span>所属公司：北京京东联行房地产顾问有限公司</span></p>
                  </div>
                </div>
                <div class="clearfix" style="width:86%;margin:5px auto 0;">
                  <a href="javascript:;" class="for-button pull-left">
                    <img src="static/ffyxq/images/agent-1.svg" />从业信息卡
                  </a>
                  <a href="javascript:;" class="for-button pull-right">
                    <img src="static/ffyxq/images/agent-2.svg" />营业执照
                  </a>
                </div>
              </div> -->
            </div>
          </div>
        </div>
      </div>
      <div
        class="maskLayer"
        id="maskLayer"
        style="display: none"
        onclick="maskhide()"
      ></div>
      <div
        class="maskLayer"
        id="inforImg"
        style="display: none"
        onclick="maskhide1()"
      ></div>
      <div
        class="wrapper mt-45 clearfix"
        id="building-probably"
        style="overflow:visible;"
      >
        <div class="wrap-box clearfix" id="building-sketch">
          <div class="left-720" style="margin:0;">
            <div class="mode-title">
              <h3>楼盘概况</h3>
            </div>
            <div class="mode-content" onclick="goMain()">
              <div class="description">
                <div class="description-img">
                  <img id="lptp" />
                </div>
                <div class="description-info">
                  <h3 id="name"></h3>
                  <div class="side-house">
                    <ul>
                      <li class="li-inline">
                        <span>建成年代：</span>
                        <a id="jcnd"></a>
                      </li>
                      <li class="li-inline">
                        <span>建筑面积：</span>
                        <a id="jzmj"></a>
                      </li>
                      <li class="li-inline">
                        <span>所属商圈：</span>
                        <a id="sssq"></a>
                      </li>
                      <li class="li-inline">
                        <span>楼栋数量：</span>
                        <a id="ldsl"></a>
                      </li>
                      <li class="li-inline">
                        <span>所在环线：</span>
                        <a id="szhx"></a>
                      </li>
                      <li class="li-inline">
                        <span>最高楼层：</span>
                        <a id="zglc"></a>
                      </li>
                      <li>
                        <span>开发商：</span>
                        <a id="kfs"></a>
                      </li>
                      <li>
                        <span>楼盘地址：</span>
                        <a id="lpdz1"></a>
                      </li>
                    </ul>
                  </div>
                </div>
              </div>
            </div>
          </div>
        </div>
      </div>

      <div class="wrapper mt-45">
        <div class="wrap-box clearfix">
          <div class="mode-title">
            <h3>周边配套</h3>
          </div>
          <div class="mode-content">
            <div id="allmap" class="new-map" style="height:360px;"></div>
            <!-- 这里放地图 -->
            <!--  <div class="new-map"> -->
            <div
              class="map-search"
              style="position:absolute;width:370px;top:15px;right:20px;"
            >
              <ul class="map-li clearfix" id="zbpt">
                <li class="active"><a href="javascript:;">地铁站</a></li>
                <li><a href="javascript:;">公交站</a></li>
                <li><a href="javascript:;">银行</a></li>
                <li><a href="javascript:;">酒店</a></li>
              </ul>
              <ul
                class="map-address"
                style="overflow-y: scroll;height:284px;"
                id="jt"
              >
                <!-- <li class="clearfix">
                                    <div class="pull-left"
                                        style="line-height: 40px;font-size: 20px;margin-right: 15px;">
                                        <i class="fa fa-map-marker"></i>
                                    </div>
                                    <div class="pull-left">
                                        <p>
                                            <span style="font-weight:600;font-size:14px;padding-right:30px;">大望路</span>
                                            <span style="font-size:12px;"><i
                                                    class="fa fa-paper-plane-o"></i>&nbsp;336米</span>
                                        </p>
                                        <p style="font-size:12px;">地铁14号线东段；地铁1号线</p>
                                    </div>
                                </li>
                                <li class="clearfix">
                                    <div class="pull-left"
                                        style="line-height: 40px;font-size: 20px;margin-right: 15px;">
                                        <i class="fa fa-map-marker"></i>
                                    </div>
                                    <div class="pull-left">
                                        <p>
                                            <span style="font-weight:600;font-size:14px;padding-right:30px;">大望路</span>
                                            <span style="font-size:12px;"><i
                                                    class="fa fa-paper-plane-o"></i>&nbsp;336米</span>
                                        </p>
                                        <p style="font-size:12px;">地铁14号线东段；地铁1号线</p>
                                    </div>
                                </li>
                                <li class="clearfix">
                                    <div class="pull-left"
                                        style="line-height: 40px;font-size: 20px;margin-right: 15px;">
                                        <i class="fa fa-map-marker"></i>
                                    </div>
                                    <div class="pull-left">
                                        <p>
                                            <span style="font-weight:600;font-size:14px;padding-right:30px;">大望路</span>
                                            <span style="font-size:12px;"><i
                                                    class="fa fa-paper-plane-o"></i>&nbsp;336米</span>
                                        </p>
                                        <p style="font-size:12px;">地铁14号线东段；地铁1号线</p>
                                    </div>
                                </li>
                                <li class="clearfix">
                                    <div class="pull-left"
                                        style="line-height: 40px;font-size: 20px;margin-right: 15px;">
                                        <i class="fa fa-map-marker"></i>
                                    </div>
                                    <div class="pull-left">
                                        <p>
                                            <span style="font-weight:600;font-size:14px;padding-right:30px;">大望路</span>
                                            <span style="font-size:12px;"><i
                                                    class="fa fa-paper-plane-o"></i>&nbsp;336米</span>
                                        </p>
                                        <p style="font-size:12px;">地铁14号线东段；地铁1号线</p>
                                    </div>
                                </li>
                                <li class="clearfix">
                                    <div class="pull-left"
                                        style="line-height: 40px;font-size: 20px;margin-right: 15px;">
                                        <i class="fa fa-map-marker"></i>
                                    </div>
                                    <div class="pull-left">
                                        <p>
                                            <span style="font-weight:600;font-size:14px;padding-right:30px;">大望路</span>
                                            <span style="font-size:12px;"><i
                                                    class="fa fa-paper-plane-o"></i>&nbsp;336米</span>
                                        </p>
                                        <p style="font-size:12px;">地铁14号线东段；地铁1号线</p>
                                    </div>
                                </li>
                                <li class="clearfix">
                                    <div class="pull-left"
                                        style="line-height: 40px;font-size: 20px;margin-right: 15px;">
                                        <i class="fa fa-map-marker"></i>
                                    </div>
                                    <div class="pull-left">
                                        <p>
                                            <span style="font-weight:600;font-size:14px;padding-right:30px;">大望路</span>
                                            <span style="font-size:12px;"><i
                                                    class="fa fa-paper-plane-o"></i>&nbsp;336米</span>
                                        </p>
                                        <p style="font-size:12px;">地铁14号线东段；地铁1号线</p>
                                    </div>
                                </li>  -->
              </ul>
            </div>
            <!-- </div>  -->
          </div>
        </div>
      </div>

      <div class="wrapper mt-45">
        <div class="wrap-box clearfix">
          <div class="mode-title">
            <h3>周边推荐</h3>
          </div>
          <div class="mode-content">
            <!-- 房源类型 -->
            <ul class="new-other-list" id="zbtj1"></ul>
            <!-- 房源类型 -->

            <!-- 楼盘类型 -->
            <ul class="new-other-list" id="zbtj2"></ul>
            <!-- 楼盘类型 -->
          </div>
        </div>
      </div>
    </div>
    <!--/房源信息-->

    <!--页面底部-->
    <div class="footer">
      <div class="section">
        <div class="foot-box">
          <div class="split">
            <ul class="info-k clearfix">
              <li style="width:55%;">
                <div>
                  <img
                    src="static/ffyxq/images/logo-s5.svg"
                    style="width:150px;"
                  />
                  <span>&nbsp;&nbsp;城市元素（北京）科技有限公司</span><br />
                  &nbsp;&nbsp;客户服务：<span
                    >010-65883141 ( 早9:00-晚9:00 )</span
                  ><br />
                  <!-- <span>&nbsp;&nbsp;support@3Dzhixuan.com</span><br> -->
                </div>
              </li>
              <li style="width:34%;">
                <div style="padding:0 40px;">
                  <img
                    src="static/ffyxq/images/logo/qrcode.svg"
                    style="width:150px;"
                  />
                </div>
              </li>
            </ul>
            <ul class="footer-k clearfix">
              <li>
                <a href="/item/views/others/enterDevelopers.html">入驻平台</a>
              </li>
              <li>
                <a href="/item/views/others/service.html">平台及服务</a>
              </li>
              <li>
                <a href="/item/views/others/about.html">关于我们</a>
              </li>
              <li>
                <a href="/item/views/others/teamRecruited.html">团队招募</a>
              </li>
              <li>
                <a href="/item/views/others/information.html"
                  >信息质量管理措施</a
                >
              </li>
              <li>
                <a href="/item/views/others/privacy.html">用户隐私与条款</a>
              </li>
            </ul>
            <p class="gray">
              © 2019 城市元素（北京）科技有限公司 版权所有 京ICP备 18009982号-2
            </p>
            <p class="gray" style="padding-top: 5px;">
              声明：本网站所使用的3D图像采集时间为2016年9月
            </p>
            <div style="width:300px;margin:0 auto; padding:5px 0;">
              <a
                target="_blank"
                href="http://www.beian.gov.cn/portal/registerSystemInfo?recordcode=11010502038507"
                style="display:inline-block;text-decoration:none;height:20px;line-height:20px;"
                ><img
                  src="./static/ffyxq/images/public.png"
                  style="float:left;"
                />
                <p style="float:left;height:20px;padding:2px;">
                  京公网安备 11010502038507号
                </p></a
              >
            </div>
          </div>
        </div>
      </div>
    </div>
    <!--/页面底部-->
    <script src="static/js/house.js"></script>
    <script>
      $(document).ready(function() {
        var _hmt = _hmt || [];
        (function() {
          var hm = document.createElement("script");
          hm.src =
            "https://hm.baidu.com/hm.js?2b296deeeccd704aea965e564f60be25";
          var s = document.getElementsByTagName("script")[0];
          s.parentNode.insertBefore(hm, s);
        })();

        //3D部分
        $(".button a").on("click", function() {
          $(".button a").removeClass("active");
          $(this).addClass("active");

          var aim = $(this).attr("data-type");
          if (aim == "picture") {
            $(".picture").show();
            $(".d-shadow").hide();
          } else {
            $(".d-shadow").show();
            $(".picture").hide();
            yzfh(houseid);
          }
        });
        // 提示层
        $('[data-toggle="tooltip"]').tooltip();

        $("#zbpt li").on("click", function() {
          if ($(this).hasClass("active")) {
          } else {
            $("#zbpt li").removeClass("active");
            $(this).addClass("active");
            btn("jt", $(this)[0].innerText);
          }
        });
      });

      ajax(
        "/api/v1/building/getHouseImgs",
        "post",
        { houseId: getParams("houseid") },
        function(result) {
          if (result.data.length > 0) {
            var str = "";
            for (var i = 0; i < result.data.length; i++) {
              str = str =
                '<div class="swiper-slide">' +
                "<img src=" +
                getDefaultImg(result.data[i]) +
                ">" +
                "</div>";
              $("#piclist").append(str);
            }
          } else {
            var str =
              '<div class="swiper-slide">' +
              "<img src=" +
              getDefaultImg(undefined) +
              ">" +
              "</div>";
            $("#piclist").append(str);
          }
          setTimeout(function() {
            // 滑动
            var previewSwiper = new Swiper(".main-page", {
              slidesPerView: "auto",
              allowTouchMove: true,
              loop: true,
              // autoplay: {
              //   disableOnInteraction: false, //手动滑动之后不打断播放
              //   delay: 5000
              // },
              prevButton: ".swiper-button-prev",
              nextButton: ".swiper-button-next",
              pagination: ".swiper-pagination",
              paginationClickable: true
            });
          }, 1000);
        }
      );

      $(window).scroll(function() {
        pageScroll();
      });

      function pageScroll() {
        var scroll = $(window).scrollTop();
        if (scroll < 40) {
          $(".new-header-2").addClass("headerPosition");
          $(".site-top-nav").removeClass("hide");
        } else {
          $(".new-header-2").removeClass("headerPosition");
          $(".site-top-nav").addClass("hide");
        }
      }
      pageScroll();
    </script>
    <script>
      var cr = "";
      var resu;
      var marker1 = "";
      var point1;

      var map = new BMap.Map("allmap", { enableMapClick: false }); // 创建Map实例
      // 左上角，添加比例尺
      var top_left_control = new BMap.ScaleControl({
        anchor: BMAP_ANCHOR_TOP_LEFT
      });
      //左上角，添加默认缩放平移控件
      var top_left_navigation = new BMap.NavigationControl();
      map.addControl(top_left_navigation);
      //添加滚轮放大、缩小
      map.enableScrollWheelZoom(true);
      cr = new BMap.CopyrightControl({ anchor: BMAP_ANCHOR_TOP_RIGHT }); //设置版权控件位置
      map.addControl(cr); //添加版权控件
      //创建地址解析器实例
      var myGeo = new BMap.Geocoder();
      // 将地址解析结果显示在地图上,并调整地图视野
      //commname = "华贸中心";
      // myGeo.getPoint(
      //   commname,
      //   function(point) {
      //     if (point) {
      //       map.centerAndZoom(point, 16);
      //       btn("jt", "地铁");
      //     } else {
      //       alert("您选择地址没有解析到结果!");
      //     }
      //   },
      //   "北京市"
      // );
      function btn(id, name) {
        if (point1) {
          map.clearOverlays();
          map.centerAndZoom(point1, 16);
          var myIcon = new BMap.Icon(
            "http://api.map.baidu.com/img/markers.png",
            new BMap.Size(23, 25),
            {
              offset: new BMap.Size(10, 25), // 指定定位位置
              imageOffset: new BMap.Size(0, 0 - 10 * 25) // 设置图片偏移
            }
          );
          var marker = new BMap.Marker(point1, { icon: myIcon });
          //var label = new BMap.Label(commname);
          //label.setStyle({ border: "0px" });
          //marker.setLabel(label);

          map.addOverlay(marker);
          var circle = new BMap.Circle(point1, 1000, {
            fillColor: "#ccc",
            strokeWeight: 1,
            fillOpacity: 0.2,
            strokeOpacity: 0.2
          });
          // 范围区域
          map.addOverlay(circle);
          if (name == "公交站") {
            var myIcon1 = new BMap.Icon(
              "images/gongjiao.png",
              new BMap.Size(16, 16)
            );
          } else if (name == "地铁站") {
            var myIcon1 = new BMap.Icon(
              "images/ditie.png",
              new BMap.Size(16, 16)
            );
          } else if (name == "银行") {
            var myIcon1 = new BMap.Icon(
              "images/yinhang.png",
              new BMap.Size(16, 16)
            );
          } else if (name == "酒店") {
            var myIcon1 = new BMap.Icon(
              "images/jiudian.png",
              new BMap.Size(14, 23)
            );
          } else {
            var myIcon1 = new BMap.Icon(
              "images/ditie.png",
              new BMap.Size(16, 16)
            );
          }
          // var myIcon1 = new BMap.Icon(
          //   "images/marker1.png",
          //   new BMap.Size(14, 23)
          // );
          var local = new BMap.LocalSearch(map, {
            renderOptions: { map: map, autoViewport: false },
            pageCapacity: 20
          });
          local.setMarkersSetCallback(function(result) {
            for (var i = 0; i < result.length; i++) {
              result[i].marker.setIcon(myIcon1);
              result[i].marker.setShadow(myIcon1);
            }
          });
          local.setSearchCompleteCallback(function(result) {
            var s = [];
            var html = "";
            for (var i = 0; i < result.Br.length; i++) {
              var endpoint = new BMap.Point(
                result.Br[i].point.lng,
                result.Br[i].point.lat
              );
              var distance = map.getDistance(point1, endpoint).toFixed(0);

              s.push(result.Br[i].title + ", " + distance + "米");
              html +=
                "<li class='clearfix' onclick=aClick('" +
                result.Br[i].point.lat +
                "','" +
                result.Br[i].point.lng +
                "','" +
                result.Br[i].title +
                "')>" +
                "<div class='pull-left' style='line-height: 40px;font-size: 20px;margin-right: 15px;'> <i class='fa fa-map-marker'></i></div><div class='pull-left'> <p><span style='font-weight:600;font-size:14px;padding-right:30px;'>" +
                result.Br[i].title +
                "</span><span style='font-size:12px;'><i class='fa fa-paper-plane-o'></i>&nbsp;" +
                distance +
                "米</span></p> <p style='font-size:12px;'>" +
                result.Br[i].address +
                "</p></div></li>";
            }
            document.getElementById(id).innerHTML = html;
          });
          local.searchNearby(name, point1, 1000);
        } else {
          alert("您选择地址没有解析到结果!");
        }
      }
      function aClick(lng, lat, title) {
        map.removeOverlay(marker1);
        var point = new BMap.Point(lat, lng);
        var myIcon2 = new BMap.Icon("images/dh.gif", new BMap.Size(48, 48));
        marker1 = new BMap.Marker(point, { icon: myIcon2 });
        var icon = marker1.getIcon();
        marker1.setShadow(icon);
        //marker1.setLabel(new BMap.Label(title));
        map.addOverlay(marker1);
        map.panTo(point);
      }
      //点击结果面板
      function clicked(dom) {
        var collection = $(".linkli");
        $.each(collection, function() {
          $(this).removeClass("end");
          $(this).addClass("start");
        });
        $(dom).removeClass("start");
        $(dom).addClass("end");

        //map.panTo(point);
      }
      //地铁站
      function dtz() {
        $("#gjz").css({ color: "black" });
        $("#dtz").css({ color: "blue" });
        btn("cont", "地铁");
      }
      //公交站
      function gjz() {
        $("#gjz").css({ color: "blue" });
        $("#dtz").css({ color: "black" });
        btn("cont", "公交");
      }

      function jiaotong() {
        $("#jy").css({ color: "black" });
        $("#gw").css({ color: "black" });
        $("#sh").css({ color: "black" });
        $("#yul").css({ color: "black" });
        $("#yl").css({ color: "black" });
        $("#jt").css({ color: "blue" });
        $("#gjz").css({ color: "black" });
        $("#dtz").css({ color: "blue" });
        $("#jiaoyudiv").hide();
        $("#jiaotongdiv").show();
        $("#gouwudiv").hide();
        $("#shenghuodiv").hide();
        $("#yulediv").hide();
        $("#yiliaodiv").hide();
        btn("cont", "地铁");
      }
      function jiaoyu() {
        $("#jt").css({ color: "black" });
        $("#jy").css({ color: "blue" });
        $("#gw").css({ color: "black" });
        $("#jt").css({ color: "black" });
        $("#sh").css({ color: "black" });
        $("#yul").css({ color: "black" });
        $("#yl").css({ color: "black" });
        $("#jiaoyudiv").show();
        $("#jiaotongdiv").hide();
        $("#gouwudiv").hide();
        $("#shenghuodiv").hide();
        $("#yulediv").hide();
        $("#yiliaodiv").hide();
        btn("cont1", "餐饮");
      }
      function yiliao() {
        $("#jt").css({ color: "black" });
        $("#jy").css({ color: "black" });
        $("#gw").css({ color: "black" });
        $("#jt").css({ color: "black" });
        $("#sh").css({ color: "black" });
        $("#yul").css({ color: "black" });
        $("#yl").css({ color: "blue" });
        $("#jiaoyudiv").hide();
        $("#jiaotongdiv").hide();
        $("#gouwudiv").hide();
        $("#shenghuodiv").hide();
        $("#yulediv").hide();
        $("#yiliaodiv").show();
        btn("cont2", "银行");
      }
      function gouwu() {
        $("#jt").css({ color: "black" });
        $("#gw").css({ color: "blue" });
        $("#yl").css({ color: "black" });
        $("#sh").css({ color: "black" });
        $("#yul").css({ color: "black" });
        $("#jy").css({ color: "black" });
        $("#jiaoyudiv").hide();
        $("#jiaotongdiv").hide();
        $("#yiliaodiv").hide();
        $("#gouwudiv").show();
        $("#shenghuodiv").hide();
        $("#yulediv").hide();
        btn("cont3", "酒店");
      }
      function shenghuo() {
        $("#jt").css({ color: "black" });
        $("#jy").css({ color: "black" });
        $("#gw").css({ color: "black" });
        $("#sh").css({ color: "blue" });
        $("#yul").css({ color: "black" });
        $("#yl").css({ color: "black" });
        $("#jiaoyudiv").hide();
        $("#jiaotongdiv").hide();
        $("#gouwudiv").hide();
        $("#yiliaodiv").hide();
        $("#shenghuodiv").show();
        $("#yulediv").hide();
        btn("cont4", "生活");
      }
      function yule() {
        $("#jt").css({ color: "black" });
        $("#jy").css({ color: "black" });
        $("#gw").css({ color: "black" });
        $("#jt").css({ color: "black" });
        $("#sh").css({ color: "black" });
        $("#yul").css({ color: "blue" });
        $("#yl").css({ color: "black" });
        $("#jiaoyudiv").hide();
        $("#jiaotongdiv").hide();
        $("#gouwudiv").hide();
        $("#yiliaodiv").hide();
        $("#shenghuodiv").hide();
        $("#yulediv").show();
        btn("cont5", "娱乐");
      }
    </script>
    <script
      type="text/javascript"
      charset="utf-8"
      src="static/js/ffyxq.js?version=1.0.12"
    ></script>
  </body>
</html>
